<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

	
	<!-- DATA TABLES -->
	<link rel="stylesheet" type="text/css" href="js/datatables/media/css/jquery.dataTables.min.css" />
	<link rel="stylesheet" type="text/css" href="js/datatables/media/assets/css/datatables.min.css" />
	<link rel="stylesheet" type="text/css" href="js/datatables/extras/TableTools/media/css/TableTools.min.css" />
    <link rel="stylesheet" type="text/css" href="css/page.css"/>
    <script src="js/jquery/jquery-2.0.3.min.js"></script>
	  <!-- /SIDEBAR -->
		<div id="main-content">
			
		<!--===========================================添加============================================  -->	
			<div class="modal fade" id="box-config" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
				<div class="modal-dialog">
				  <div class="modal-content">
					<div class="modal-header">
					
					<button type="button" class="close"  aria-hidden="true" data-dismiss="modal">&times;</button>
					  <h4 class="modal-title" style="text-align: center;"><b>新添出境服务单位</b></h4>
					</div>		 
			 <form class="form-horizontal" role="form" action="./insertOffice" method="post">
					<div class="modal-body">
										
						   <div style="margin-left: 90px;">
							   <table>
							   <tr>
								   <td style="height: 50px;">单位名称：</td>
								   <td style="height: 50px;">
								      <input type="text" name="randomOf" style="height:30px; width: 260px;"/>
								   </td>
							   </tr>
							   <tr>
								   <td style="height: 50px;"> 状态：</td>
								   <td style="height: 50px;">
								      <input type="radio"  name="randomType" value="启用" checked="checked" style="width: 31px; height: 26px; "/> 启用  
									  &nbsp;&nbsp;
									  <input type="radio"  name="randomType" value="禁用" style="width: 31px; height: 26px; "/> 禁用 
								   </td>
							   </tr>
								<tr>
								   <td colspan="2" style="height: 50px;">
	                                 <input type="submit" class="btn btn-lg btn-primary" value="添加"  style="margin-left: 36%;"/>
		                             <button type="reset" class="btn btn-lg btn-primary">重填</button>                                               
	                               </td>
							   </tr>     
							  </table>
						</div>
					</div>
			   </form>
			   
				  </div>
				</div>
			  </div>

			 <!--========================禁用|启用===========================  -->
			 <div class="modal fade" id="box-open" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
				<div class="modal-dialog">
				  <div class="modal-content">
					<div class="modal-header">
					  <button type="button" class="close"  aria-hidden="true" data-dismiss="modal">&times;</button>
					  <h4 class="modal-title" style="text-align: center;"><b>状态修改（是否启用）</b></h4>
					</div>
					<form class="form-horizontal" role="form" method="post" action="./updateOffice">
					<div class="modal-body">
										
						   <div style="margin-left: 90px;">
							   <input type="hidden" name="id" value="${randomOffices.id}"/>
							   <input type="hidden" style="height:30px; width: 260px;" name="randomOf" value="${randomOffices.randomOf}"/>
							   <table style="margin-left: 100px;">
							   <tr>
								   <td style="height: 50px;text-align: center;"> 状态：</td>
								   <td style="height: 50px;text-align: center;">
								      <input type="radio"  name="randomType" value="启用" checked="checked" /> 启用  
									  <input type="radio"  name="randomType" value="禁用" /> 禁用 
								   </td>
							   </tr>
								<tr>
								   <td colspan="2" style="height: 50px;text-align: center;">
	                                           <button type="submit" class="btn btn-warning"  >修改</button>
		                                  <a href="##"><button type="button" class="btn btn-danger">返回</button></a>                                               
	                                           </td>
							   </tr>
							  
								      
								       
							  </table>
						</div>
						
					</div>
					<div>
					  
					</div>
			   </form>
				  </div>
				</div>
			  </div> 
			 <!--=====================禁用|启用==================================  -->  
			<div class="container">
				<div class="row">
					<div id="content" class="col-lg-12">
						<!-- PAGE HEADER-->
						<div class="row">
							<div class="col-sm-12">
								<div class="page-header">
									<!-- STYLER -->
									
									<!-- /STYLER -->
									<!-- BREADCRUMBS -->
									<ul class="breadcrumb">
										<li>
											<i class="fa fa-home"></i>
											<a href="index.jsp">主页</a>
										</li>
										<li>
											<a href="javascript:;">出境服务单位信息</a>
										</li>
									</ul>
									<!-- /BREADCRUMBS -->
									<div class="description">
									   <p><b>注意事项：</b>添加服务单位请点击表的右上角[“<i class="fa fa-plus"></i>”] 。</p>
									</div>
								</div>
							</div>
						</div>
						<!-- /PAGE HEADER -->
						<!-- DATA TABLES -->
						<div class="row">
							<div class="col-md-12">
								
									<div class="col-md-13">
								<!-- BOX -->
								<div class="box border gray">
									<div class="box-title">
										<h4><i class="fa fa-bars"></i>出国(境)服务单位信息表</h4>
										<div class="tools">
										    <!--添加  -->
										    <a href="#box-config" data-toggle="modal" class="config">
														<i class="fa fa-plus"></i>
													</a>
										

										</div>
									</div>
									<div class="box-body">
										
										<table class="table table-striped table-bordered table-hover">
											
											  <tr style="text-align: center;">
												<td><h4><b>[编号]</b></h4></td>
												<td><h4><b>[公司名称]</b></h4></td>
												<td><h4><b>[状态]</b></h4></td>
												<td><h4><b>[操作]</b></h4></td>
											  </tr>
											
											<tbody>
											<c:forEach items="${page.lists}" var="opp">
											  <tr style="text-align: center;">
												<td><h5><b>${opp.id}</b></h5></td>
												<td><h5><b>${opp.randomOf}</b></h5></td>
												<td><h5><b>${opp.randomType}</b></h5></td>
												<td>
												<a href="./getOfficeByIds?id=${opp.id}">
												    <button type="button" class="btn btn-warning">禁用|启用</button>
												 </a>
											    <a href="./getOfficeById?id=${opp.id}">
											        <button type="button" class="btn btn-info">修改</button>
											     </a>											
												<a href="./deleteOffice?id=${opp.id}"><button type="button" class="btn btn-success" >删除</button></a>
												</td>
											  </tr>
											  </c:forEach>
											  <!--分页  -->
												<tr>
										            <td style="text-align: center;" colspan="5">
										               <span class="disabled">
										                  <div class="meneame">${page.html}</div>
										               </span>
										            </td>
									            </tr>
											</tbody>
										  </table>
									</div>
								</div>
								<!-- /BOX -->
							</div>
								</div>
								<!-- /BOX -->
							</div>
							
						</div>
						  
					</div><!-- /CONTENT-->
				</div>
			</div>

	</section>

	<!-- DATA TABLES -->
	<script type="text/javascript" src="js/datatables/media/js/jquery.dataTables.min.js"></script>
	<script type="text/javascript" src="js/datatables/media/assets/js/datatables.min.js"></script>
	<script type="text/javascript" src="js/datatables/extras/TableTools/media/js/TableTools.min.js"></script>
	<script type="text/javascript" src="js/datatables/extras/TableTools/media/js/ZeroClipboard.min.js"></script>
	
	<script>
		jQuery(document).ready(function() {		
			App.setPage("randomOfficeShow");  //Set current page
			App.init(); //Initialise plugins and elements
		});
	</script>

